<template>
	<view class="content">
    <concern-banner ref="concern"></concern-banner>
    <view class="tips-box"></view>
   <view class="uni-margin-wrap">
      <swiper class="swiper" circular indicator-dots="true" :current="current" @change="coinChange">
        <swiper-item>
          <view class="swiper-item">
            <view class="info-block">
              <view class="ques-box">
                <view @click="chooseDate" class="top-section">
                  <view class="input_text">{{year}}年{{month}}{{day}}
                    {{hour>9?hour:'0'+hour}}:{{minute>9?minute:'0'+minute}}</view>
                  <img class="arrow-icon" src="../../static/images/bazi/arrow_down.png"></img>
                </view>
                <view class="top-section">
                  <input v-model="issue" maxlength="80" class="name input_text" placeholder="填写占问内容" />
                </view>
              </view>
              <view class="tips-content">铜钱摇卦法</view>
              <view class="section">
                <view class="section-content">
                  <input v-model="gua" maxlength="10" class="name input_text" placeholder='铜钱背数' disabled="true" />
                </view>
              </view>
              <view class="section">
                <view class="coin-group" @click="guaSingle">
                  <view class="coin-img front-img" src="@/static/images/liuyao/front.png"></view>
                  <view class="coin-img back-img" src="@/static/images/liuyao/back.png"></view>
                  <view class="coin-img front-img" src="@/static/images/liuyao/front.png"></view>
<!--                  <view v-show="coinArr[1] != 0" class="coin-img back-img" src="@/static/images/liuyao/back.png"></view>
                  <view v-show="coinArr[2] == 0" class="coin-img front-img" src="@/static/images/liuyao/front.png"></view>
                  <view v-show="coinArr[2] != 0" class="coin-img back-img" src="@/static/images/liuyao/back.png"></view> -->
                </view>
              </view>
              <view class="coin">
                <view class="coin-title">说明</view>
                <p class="coin-sub">操作方法：</p>
                <p>【点击铜钱】得出背数，重复六次。</p>
              </view>
            </view>            
          </view>
        </swiper-item>
        <swiper-item>
          <view class="swiper-item">
            <view class="info-block">
              <view class="ques-box">
                <view @click="chooseDate" class="top-section">
                  <view class="input_text">{{year}}年{{month}}{{day}}
                    {{hour>9?hour:'0'+hour}}:{{minute>9?minute:'0'+minute}}</view>
                  <img class="arrow-icon" src="../../static/images/bazi/arrow_down.png"></img>
                </view>
                <view class="top-section">
                  <input v-model="issue" maxlength="80" class="name input_text" placeholder="填写占问内容" />
                </view>
              </view>
              <view class="tips-content">卦名起卦法</view>
              <view class="section">
                <view class="gua-title">本卦</view>
                <view class="gua-select" @click="openGuaSelect('benguaPopup')">
                  <view v-if="bengua!=''">{{bengua}}</view>
                  <view v-else>点击选择</view>
                </view>
              </view>
              <view class="section">
                <view class="gua-title">变卦</view>
                <view class="gua-select" @click="openGuaSelect('bianguaPopup')">
                  <view v-if="biangua!=''">{{biangua}}</view>
                  <view v-else>点击选择</view>
                </view>
              </view>
            </view>
          </view>
        </swiper-item>
        <swiper-item>
          <view class="swiper-item">
            <view class="info-block">
              <view class="ques-box">
                <view @click="chooseDate" class="top-section">
                  <view class="input_text">{{year}}年{{month}}{{day}}
                    {{hour>9?hour:'0'+hour}}:{{minute>9?minute:'0'+minute}}</view>
                  <img class="arrow-icon" src="../../static/images/bazi/arrow_down.png"></img>
                </view>
                <view class="top-section">
                  <input v-model="issue" maxlength="80" class="name input_text" placeholder="填写占问内容" />
                </view>
              </view>
              <view class="tips-content">硬币背数法</view>
              <view class="section">
                <view class="section-content">
                  <input v-model="guaNum" maxlength="10" class="name input_text" placeholder='填写背数:例如"312101"' />
                </view>
              </view>
              <view class="coin">
                <view class="coin-title">说明</view>
                <p class="coin-sub">背面：</p>
                <p>指硬币【没有数字】的那一面。</p>
                <p class="coin-sub">操作方式：</p>
                <p>第1步，将三枚硬币握在手中，心中默念想占问的事。</p>
                <p>第2步，抛出硬币后，数【背面】，没有背面，记为【0】；一个背面，记为【1】；两个，记为【2】；三个记为【3】</p>
                <p>第3步，总共摇六次，依次记下六个数字，并填写在上方。</p>
              </view>
            </view>
          </view>
        </swiper-item>
      </swiper>
    </view>
    <view class="btn-box">
      <view class="re-btn" @click="bindQueryBazi">立即排盘</view>
      <view class="cancel-btn" @click="cancel">重新起卦</view>
    </view>
		<activity-box :positionId="202"></activity-box>
    <yipu-logo></yipu-logo>
    <gua-modal ref="benguaPopup" :gua.sync="bengua"></gua-modal>
    <gua-modal ref="bianguaPopup" :gua.sync="biangua"></gua-modal>
		<!-- 时间选择弹出框 -->
		<view :class="['picker-view',showDatePickerView?'show':'']">
			<view class="picker-inner">
				<view class="pick_header">
					<view @click="onCalendar0Click" :class="['pick-item', isLunar==true?'':'pick-active']">阳历</view>
					<view @click="onCalendar1Click" :class="['pick-item', isLunar==true?'pick-active':'']">阴历</view>
				</view>
				<view class="time">
					<text class="hm-span">:</text>
					<picker-view @change="bindChange" indicatorStyle="height:80rpx;" style="height:100%" :value="value">
						<picker-view-column>
							<view class="item" v-for="(item, index) in lunarYears" :key="index">{{item+"年"}}</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item, index) in (isLunar?lunarMonths:months)" :key="index">
								{{item}}</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item, index) in (isLunar?lunarDays:days)" :key="index">{{item}}
							</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item, index) in (isLunar?lunarHours:hours)" :key="index">
								{{isLunar?item:(item>9?item:'0'+item)}}</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item, index) in minutes" :key="index">{{item>9?item:'0'+item}}
							</view>
						</picker-view-column>
					</picker-view>
				</view>
				<view class="btns">
					<view @click="confirmSelectDate" class="confirm">确定</view>
				</view>
			</view>
		</view>
    <!-- 确认弹窗 -->
    <uni-popup ref="confirmPopup" type="center" :mask-click="false" mask-background-color="rgba(0,0,0,0.8)">
      <view class="confirm-hit-box">
        <view class="confirm-tips">
          确定重新起卦？
        </view>
        <view class="confirm-btn-box">
          <view class="confirm-btn" @click="confirmPop">是</view>
          <view class="confirm-btn" @click="closePop">否</view>
        </view>
      </view>
    </uni-popup>
	</view>
</template>

<script>
	for (
		var a,
			n,
			l,
			// t = require("../../@babel/runtime/helpers/interopRequireDefault"),
			// e = t(require("../../@babel/runtime/regenerator")),
			// g = require("../../@babel/runtime/helpers/asyncToGenerator"),
			// m = (t(require("../../utils/request")), getApp()),
			s = [27472, 11168, 43874, 37744, 21222, 53600, 58544, 27941, 55952, 23376, 14035, 10976, 41696, 58066, 51536,
				54614, 46368, 46736, 23972, 21968, 9680, 42419, 41648, 43191, 43359, 46240, 45733, 44383, 21936, 11124,
				9584, 21241, 21168, 26960, 27990, 23200, 43856, 22228, 19168, 42352, 17747, 53935, 59559, 54623, 23200,
				44453, 38352, 19168, 43700, 42192, 53944, 45712, 46416, 22359, 11680, 38352, 19829, 18864, 42160, 42163,
				27295, 44440, 27472, 11104, 37733, 37759, 18800, 26980, 58528, 60010, 55952, 23248, 10966, 10991, 37600,
				51925, 51536, 54432, 54435, 46751, 22439, 21936, 9680, 38325, 37552, 43344, 55636, 46240, 46416, 27986,
				21936, 10102, 9584, 21168, 43685, 59728, 27296, 47779, 43856, 19416, 19168, 42352, 21717, 53856, 55632,
				91476, 22191, 39632, 21970, 19168, 42422, 42192, 53840, 53845, 46415, 54944, 44450, 38320, 18807, 18815,
				42160, 46261, 27216, 27968, 43860, 11119, 38256, 21234, 18800, 25958, 54432, 59984, 28309, 23248, 11104,
				34531, 37615, 51415, 51551, 54432, 55462, 46431, 22176, 42420, 9695, 37584, 53938, 43344, 46423, 27808,
				46416, 21333, 19887, 42416, 17779, 21183, 43432, 59728, 27296, 44710, 43856, 19296, 43748, 42352, 21088,
				62051, 55632, 23383, 22176, 38608, 19925, 19152, 42192, 54484, 53840, 54616, 46400, 46752, 38310, 38335,
				18864, 43380, 42160, 45690, 27216, 27968, 44870, 43872, 38256, 19189, 18800, 25776, 29859, 59984, 27480,
				23232, 43872, 38613, 37600, 51552, 55636, 54432, 55888, 30034, 22176, 43959, 9680, 37584, 51893, 43344,
				46240, 47780, 44368, 21977, 19360, 42416, 20854, 21183, 43312, 31060, 27296, 44368, 23378, 19296, 42726,
				42208, 53856, 60005, 54576, 23200, 30371, 38608, 19195, 19152, 42192, 53430, 53855, 54560, 56645, 46496,
				22224, 21938, 18864, 42359, 42160, 43600, 45653, 27951, 44448, 19299, 37759, 18936, 18800, 25776, 26790,
				59999, 27424, 42692, 43759, 37600, 53987, 51552, 54615, 54432, 55888, 23893, 22176, 42704, 21972, 21200,
				43448, 43344, 46240, 46758, 44368, 21920, 43940, 42416, 21168, 45683, 26928, 29495, 27296, 44368, 19285,
				19311, 42352, 21732, 53856, 59752, 54560, 55968, 27302, 22239, 19168, 43476, 42192, 53584, 62034, 54560
			],
			i = ["正月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "冬月", "腊月"],
			r = ["01月", "02月", "03月", "04月", "05月", "06月", "07月", "08月", "09月", "10月", "11月", "12月"],
			o = ["01日", "02日", "03日", "04日", "05日", "06日", "07日", "08日", "09日", "10日", "11日", "12日", "13日", "14日", "15日",
				"16日", "17日", "18日", "19日", "20日", "21日", "22日", "23日", "24日", "25日", "26日", "27日", "28日", "29日", "30日",
				"31日"
			],
			u = ["初一", "初二", "初三", "初四", "初五", "初六", "初七", "初八", "初九", "初十", "十一", "十二", "十三", "十四", "十五", "十六", "十七",
				"十八", "十九", "廿十", "廿一", "廿二", "廿三", "廿四", "廿五", "廿六", "廿七", "廿八", "廿九", "卅十"
			],
			h = new Date(),
			c = [],
			d = [],
			f = [],
			p = [],
			v = [],
			D = [],
			w = [],
			b = [],
			y = "",
			x = 0; x <= 298; x++) {
		var S = 1801 + x;
		S == h.getFullYear() && (a = x),
			c.push(S),
			D.push(S);
	}

	for (var I = U(D[a]), A = 0; A < I.length; A++) A == h.getMonth() && (n = A), w.push(I[A].name);

	var k = h.getMonth() + 1,
		P = 0;

	P = k == L(D[a]) ? H(D[a], k, !0) : k > L(D[a]) ? H(D[a], k, !1) : H(D[a], k + 1, !1);

	for (var C = 0; C < P; C++) b.push(u[C]);

	for (var z = 0; z <= 11; z++) z == h.getMonth() && (n = z), d.push(r[z]);

	for (var T = 0; T < q(c[a], n + 1); T++) T == h.getDate() - 1 && (l = T), f.push(o[T]);

	for (var M = 0; M <= 23; M++) p.push(M);

	for (var V = 0; V <= 59; V++) v.push(V);

	var O = !0;

	function q(a, n) {
		return 2 == n ? a % 4 == 0 && a % 100 != 0 || a % 400 == 0 ? 29 : 28 : 4 == n || 6 == n || 9 == n || 11 == n ? 30 :
			31;
	}

	function L(a) {
		var n = 15 & s[a - 1801];
		return 15 == n ? 0 : n;
	}

	function U(a) {
		for (var n = [], l = 1; l <= 12; l++) n.push({
			id: l,
			name: G(l)
		});
		var t = L(a);
		return 0 != t && n.splice(t, 0, {
			id: t,
			name: "闰" + G(t)
		}), n;
	}

	function H(a, n, l) {
		if (!l) return (s[a - 1801] & 65536 >> n) > 0 ? 30 : 29;
		var t = L(a);
		return 0 != t && t == n ? 15 == (15 & s[a - 1801 + 1]) ? 30 : 29 : void 0;
	}

	function G(a) {
		return i[a - 1];
	}

	function Y(a, n) {
		var l, t = (l = a) % 400 == 0 && l % 3200 != 0 || l % 4 == 0 && l % 100 != 0 || l % 3200 == 0 && l % 172800 == 0 ?
			29 : 28;
		switch (n) {
			case 1:
				return 31;
			case 2:
				return t;
			case 3:
				return 31;
			case 4:
				return 30;
			case 5:
				return 31;
			case 6:
				return 30;
			case 7:
			case 8:
				return 31;
			case 9:
				return 30;
			case 10:
				return 31;
			case 11:
				return 30;
			case 12:
				return 31;
		}
		return 0;
	}

	function B(a, n, l, t) {
		for (var e = 0; e < i.length; e++) n == i[e] && (n = e + 1);
		for (var g = 0; g < u.length; g++) l == u[g] && (l = g + 1);
		for (var m = 0, s = 1801; s < a; s++)
			for (var r = L(s), o = 1; o <= 12; o++) m += H(s, o, !1),
				o == r && (m += H(s, o, !0));
		for (var h = L(a), c = 1; c < n; c++) m += H(a, c, !1), c == h && (m += H(a, c, !0));
		1 == t && h == n && (m += H(a, n, !1)), m += l;
		var d = 1801,
			f = 2,
			p = 13,
			v = 0;
		for (p += m -= 1;;) {
			var D = Y(d, f);
			// 剩余天数大于当月天数, 则剩余天数减去当月天数,月份+1
			if (p > D) {
				p -= D;
				f += 1;
			}
			// 月份大于12 则月份为1,年数+1,
			if (f > 12) {
				f = 1;
				d += 1;
			}
			// 小于等于当月天数(注意f会变化,要再次用新f去获取当月天数比较),跳出循环
			let curD = Y(d, f);
			if (p <= curD) break
			// if (p > D && (p -= D, f += 1), f > 12 && (f = 1, d += 1), p <= D) break;
			if (++v > 1e5) break;
		}
		return d + "-" + f + "-" + p;
	}
  
	import { mapGetters } from 'vuex';
	export default {
		data() {
			return {
        current: 0,
        bengua: "",
        biangua: "",
        issue: "",
        guaNum: "",
        gua: "",
        coinTimer: null,
				coinArr: [0, 0, 0],
				// 日历类型 false:公历,true:农历
				isLunar: false,
				// 年月日
				lunarYears: D,
				lunarMonths: w,
				lunarDays: b,
				// lunarHours: ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"],
				years: c,
				months: d,
				days: f,
				hours: p,
				minutes: v,
				lunarHours: ["子时 00", "丑时 01", "丑时 02", "寅时 03", "寅时 04", "卯时 05", "卯时 06", "辰时 07", "辰时 08", "巳时 09",
					"巳时 10", "午时 11", "午时 12", "未时 13", "未时 14", "申时 15", "申时 16", "酉时 17", "酉时 18", "戌时 19", "戌时 20",
					"亥时 21", "亥时 22", "子时 23"
				],
				// minutes: ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"],
				// 出生日期时间
				value: [0, 0, 0, 0, 0],
				year: 0,
				month: 0,
				day: 0,
				hour: 0,
				minute: 0,
				// 经纬度,真太阳时
				lat: 39,
				lng: 120,
				solartime: "",
				// picker框
				showDatePickerView: false
			}
		},
		computed: {
      ...mapGetters({
        isConcern: 'user/isConcern'
      })
    },
		methods: {
			// 公历切换
			onCalendar0Click: function(e) {
				if (this.isLunar == false) return
				this.isLunar = false;
				this.onSolarChange(true);
			},
			// 农历切换
			onCalendar1Click: function(e) {
				if (this.isLunar == true) return
				this.isLunar = true;
				this.onSolarChange(false);
			},
			// 公历,农历转换
			onSolarChange: function(a) {
				// 公历转农历
				if (a == false) {
					let l = function(a, n, l) {
						let t = 1801,
							e = 2,
							g = 13,
							m = 0,
							s = 0;
						for (;;) {
							let i = Y(t, e);
							g > i && (g = 1, e += 1);
							e > 12 && (e = 1, t += 1);
							if (t == a && e == n && g == l) break;
							g += 1;
							m++;
							if (++s > 1e5) break;
						}
						t = 1801, e = 1, g = 1, s = 0, g += m;
						let r = false;
						for (;;) {
							r = !1;
							var o = H(t, e, !1);
							if (g > o) g -= o, L(t) == e ? (o = H(t, e, !0), g > o && (g -= o, e += 1), r = true) :
								e += 1;
							if (e > 12 && (e = 1, t += 1), g <= o) break;
							if (++s > 1e5) break;
						}
						return t + "-" + e + "-" + g + " " + (r ? 1 : 0);
					}(this.year, parseInt(this.month.replace("月", "")), parseInt(this.day.replace("日", ""))).split(
						" ");
					let t = l[0].split("-");
					let e = parseInt(t[0]) - 1801;
					let g = parseInt(t[1]) - 1;
					let m = parseInt(t[2]) - 1;
					if (1 == parseInt(l[1])) {
						g += 1;
					};
					this.value = [e, g, m, this.hour, this.minute]
				}
				// 农历转公历
				if (a == true) {
					let s = this.year;
					let i = this.month.replace("闰", "")
					let r = !1;
					this.month.indexOf("闰") > -1 && (r = !0);
					let o = B(s, i, this.day, r).split("-");
					let h = parseInt(o[0]) - 1801;
					let c = parseInt(o[1]) - 1;
					let d = parseInt(o[2]) - 1;
					this.value = [h, c, d, this.hour, this.minute]
				}
				// 切换后的年月日变更(阳历需要变更日,农历需要变更月日)
				if (this.isLunar == false) {
					f.length = 0;
					for (let l = 0; l < q(c[this.value[0]], this.value[1] + 1); l++) h.getDay(), f.push(o[l]);
					this.days = f
					// 再次渲染一次,避免选中的数据为后来数组新增的数据
					this.value = this.value
				} else {
					let t = this.lunarYears[this.value[0]],
						e = this.value[1],
						g = U(t);
					w.length = 0;
					for (let m = 0; m < g.length; m++) w.push(g[m].name);
					let s = 0;
					s = 0 == L(t) ? H(t, e + 1, !1) : e == L(t) ? 0 == e ? H(t, e + 1, !1) : H(t, e, !0) : e > L(t) ?
						H(t, e, !1) : H(t, e + 1, !1),
						b.length = 0;
					for (let i = 0; i < s; i++) b.push(u[i]);


					this.lunarMonths = w
					this.lunarDays = b
					// 再次渲染一次,避免选中的数据为后来数组新增的数据
					this.value = this.value
				}
				this.dataValueSetting();
			},
			// 日期
			dataValueSetting: function() {
				if (this.isLunar) {
					this.year = this.lunarYears[this.value[0]]
					this.month = this.lunarMonths[this.value[1]]
					this.day = this.lunarDays[this.value[2]]
					this.hour = this.hours[this.value[3]]
					this.minute = this.minutes[this.value[4]]
				} else {
					this.year = this.lunarYears[this.value[0]]
					this.month = this.months[this.value[1]]
					this.day = this.days[this.value[2]]
					this.hour = this.hours[this.value[3]]
					this.minute = this.minutes[this.value[4]]
				}
        this.confirmSelectArea();
			},
			// 确定出生日期
			confirmSelectDate: function(a) {
				this.dataValueSetting();
				this.showDatePickerView = false;
			},
			bindChange: function(a) {
				let n = a.detail.value;
				if (this.isLunar == false) {
					if (n[0] != this.value[0] || n[1] != this.value[1]) {
						f.length = 0;
						for (let l = 0; l < q(c[n[0]], n[1] + 1); l++) h.getDay(), f.push(o[l]);
					}
					this.days = f
					this.value = n
				} else {
					let t = this.lunarYears[n[0]],
						e = n[1],
						g = U(t);
					w.length = 0;
					for (let m = 0; m < g.length; m++) w.push(g[m].name);
					let s = 0;
					s = 0 == L(t) ? H(t, e + 1, !1) : e == L(t) ? 0 == e ? H(t, e + 1, !1) : H(t, e, !0) : e > L(t) ?
						H(t, e, !1) : H(t, e + 1, !1),
						b.length = 0;
					for (let i = 0; i < s; i++) b.push(u[i]);
					this.lunarMonths = w
					this.lunarDays = b
					this.value = n
				}
			},
			// 出生时间选中
			chooseDate: function() {
				this.showDatePickerView = true
			},
      // 出生地区确认
      confirmSelectArea: function() {
      	let a = false;
      	(this.day.indexOf("初") > -1 || this.day.indexOf("十") > -1 || this.day.indexOf("廿") > -1 || this.day
      		.indexOf("卅") > -1) && (a = true);
      	var n = 0,
      		l = 0,
      		t = 0;
      	if (a == false) n = this.year, l = parseInt(this.month.replace("月", "")),
      		t = parseInt(this.day.replace("日", ""));
      	else {
      		n = this.year, l = this.month.replace("闰", "");
      		var e = !1;
      		this.month.indexOf("闰") > -1 && (e = !0);
      		var g = B(n, l, t = this.day, e);
      		var m = g.split("-");
      		n = parseInt(m[0]), l = parseInt(m[1]), t = parseInt(m[2]);
      	}
        
        var d = n + "-" + (l < 10 ? "0" + l : l) + "-" + (t < 10 ? "0" + t : t) + " " + (this.hour < 10 ?
          "0" + this.hour : this.hour) + ":" + (this.minute < 10 ? "0" + this.minute : this.minute);
        this.solartime = d
      },
			// 开始排盘
			bindQueryBazi: function(a) {
				if (this.isConcern == true) {
					let gua = ""
					let bengua = ""
					let biangua = ""
					let guaType = ""
					if (this.current == 1) {
						guaType = "select";
						if (this.bengua == "") {
							return uni.showToast({
								title: "本卦不能为空",
								icon: "none"
							})
						}
						if (this.biangua == "") {
							return uni.showToast({
								title: "变卦不能为空",
								icon: "none"
							})
						}
						bengua = this.bengua;
						biangua = this.biangua;
					}else if (this.current == 2) {
						gua = this.guaNum.trim();
						if (gua == "" || gua == undefined || gua == null) {
							return uni.showToast({
								title: "硬币背数不能为空",
								icon: "none"
							})
						}
						if (gua.length != 6) {
							return uni.showToast({
								title: "硬币背数需要6位",
								icon: "none"
							})
						}
						var coinReg = /^[0-3]{6}$/;
						if (!coinReg.test(gua)) {
							return uni.showToast({
								title: "硬币背数只能包含0,1,2,3",
								icon: "none"
							})
						}
					}else{
						if (this.gua == "") {
							return uni.showToast({
								title: "铜钱背数不能为空",
								icon: "none"
							})
						};
						if (this.gua.length != 6) {
							return uni.showToast({
								title: "铜钱背数需要6位",
								icon: "none"
							})
						}
						gua = this.gua;
					}
					let url = `/pages/liuyao/liuyaoResult/liuyaoResult?issue=${this.issue}&solartime=${this.solartime}&gua=${gua}&guaType=${guaType}&bengua=${bengua}&biangua=${biangua}`
					uni.navigateTo({
						url: url,
					})
				}else{
          this.$refs.concern.concernPopup()
        }
			},
      guaSingle() {
        if (this.gua.length >= 6) {
          return uni.showToast({
          	title: "请开始排盘",
          	icon: "none",
          })
        }
        // if (this.coinTimer) {
          // clearInterval(this.coinTimer);
          // this.coinTimer = null;
          // 0-1随机数, 0正 1反
          this.$set(this.coinArr, 0, Math.floor(Math.random() * 2));
          this.$set(this.coinArr, 1, Math.floor(Math.random() * 2));
          this.$set(this.coinArr, 2, Math.floor(Math.random() * 2));
          // 获取背数
          let backNum = this.coinArr.filter(e => e === 1).length;
          this.gua += backNum.toString();
        // }else{
        //   this.$set(this.coinArr, 0, 0);
        //   this.$set(this.coinArr, 1, 0);
        //   this.$set(this.coinArr, 2, 0);
        //   this.coinTimer = setInterval(() => {
        //     this.$set(this.coinArr, 0, !this.coinArr[0]);
        //     this.$set(this.coinArr, 1, !this.coinArr[1]);
        //     this.$set(this.coinArr, 2, !this.coinArr[2]);
        //   }, 200)          
        // }
      },
      coinChange(e) {
        this.current = e.detail.current;
      },
      reset() {
        this.guaNum = "";
        this.gua = "";
      },
      cancel() {
        this.$refs.confirmPopup.open()
      },
      confirmPop() {
        this.closePop();
        this.guaNum = "";
        this.gua = "";
        this.bengua = "";
        this.biangua = "";
      },
      closePop() {
        this.$refs.confirmPopup.close()
      },
      openGuaSelect(type) {
        this.$refs[type].open()
      }
		},
		mounted() {
			let query = this.$route.query;
      this.current = query.current || 0;
			this.year = c[a]
			this.month = d[n]
			this.day = f[l]
			this.hour = 0
			this.minute = 0
			this.value = [a, n, l, 0, 0]
			this.solartime = c[a] + "-" + d[n].replace("月", "") + "-" + f[l].replace("日", "") + " 00:00";
    }
}
</script>

<style lang="scss" scoped>
	.content {
		width: 100%;
		// overflow-y: scroll;
    overflow-x: hidden;
		// position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 100rpx;
    .uni-margin-wrap {
      /deep/ .uni-swiper-wrapper {
        overflow: visible;
      }      
    }
	}
	.tips-box {
		height: 400rpx;
		background-color: #c6a680;
		width: 100%;
	}
  .top-section {
  	width: 561rpx;
  	height: 80rpx;
  	box-sizing: border-box;
  	font-size: 32rpx;
  	display: flex;
  	flex-direction: row;
  	align-items: center;
    justify-content: center;
  	padding: 0 30rpx;
    
    border: #c5a680 2rpx solid;
    background-color: #fff;
    margin-bottom: 20rpx;
  }
  .ques-box {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
	.tips-content {
		height: 65rpx;
		width: 100%;
		// margin-top: 56rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 34rpx;
		font-weight: bold;
    color: #32312e;
	}
  
  .uni-margin-wrap {
		/* width: 690rpx; */
		width: 90%;
    margin-top: -230rpx;
    display: flex;
    flex-direction: row;
    justify-content: center;
	}
	.swiper {
		height: 1070rpx;
    width: 100%;
	}
	.swiper-item {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 20rpx 0;
	}

	.info-block {
		background-color: #fff;
		width: 96%;
    height: 950rpx;
    box-sizing: border-box;
		border-radius: 0rpx;
		box-shadow: 0 0 20rpx #666;
		display: flex;
		flex-direction: column;
		padding-bottom: 48rpx;
    padding-top: 60rpx;
	}

	.section {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size: 32rpx;
		color: #000;
		margin-bottom: 24rpx;
	}
	.section-title {
		display: flex;
		flex-direction: row;
		justify-content: space-evenly;
		font-size: 32rpx;
		color: #32312e;
	}
	.section-content {
		width: 440rpx;
		height: 88rpx;
		box-sizing: border-box;
		font-size: 32rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 0 30rpx;
    
    border: solid 1rpx #898989;
    background-color: #fff;
	}
	.arrow-icon {
		height: 28rpx;
		width: 28rpx;
		padding-top: 4rpx;
		padding-left: 8rpx;
	}
  .gua-title {
    font-size: 32rpx;
    font-weight: bold;
    color: #32312e;
    margin: 40rpx 0 18rpx;
  }
  .gua-select {
    width: 481rpx;
    height: 60rpx;
    background-image: linear-gradient(0deg, 
      #9f8465 0%, 
      #c5a680 100%);
    
    font-size: 32rpx;
    color: #ffffff;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
  
  // 硬币背数
  .coin {
    font-size: 30rpx;
    line-height: 42rpx;
    padding: 0 37rpx;
    .coin-title {
      width: 100%;
      text-align: center;
      font-size: 40rpx;
      color: #32312e;
      font-weight: bold;
    }
    .coin-sub {
      color: #4b240d;
      margin-top: 15rpx;
      font-weight: bold;
    }
  }
  // 摇卦
  .coin-group {
    display: flex;
    flex-direction: row;
    justify-content: center;
    .coin-img {
      width: 100rpx;
      height: 100rpx;
    }
    .front-img {
      background: url('@/static/images/liuyao/front.png');
      background-repeat: no-repeat;
      background-size: 100% 100%;
    }
    .back-img {
      background: url('@/static/images/liuyao/back.png');
      background-repeat: no-repeat;
      background-size: 100% 100%;
    }
  }





	/* 弹出框 */
	.picker-view {
		background-color: rgba(0, 0, 0, .6);
		height: 100%;
		overflow: hidden;
		position: fixed;
		top: 0;
		visibility: hidden;
		width: 100%;
		max-width: 750px;
		z-index: 1000;
		display: flex;
		flex-direction: row;
		align-items: flex-end;
	}

	.picker-view.show {
		visibility: visible;
	}

	.picker-view .picker-inner {
		background-color: #fff;
		display: block;
		font-size: 30rpx;
		text-align: center;
		width: 100%;
	}

	.picker-view .picker-inner .time {
		display: block;
		height: 400rpx;
		padding: 20rpx;
		position: relative;
		color: #000;
	}

	.picker-view .picker-inner .time.show {
		display: block;
	}

	.picker-view .picker-inner .time .hm-span {
		position: absolute;
		right: 20%;
		top: 197rpx;
	}

	.picker-view .picker-inner .type {
		border-top: 1rpx solid #eee;
		height: 80rpx;
	}

	.picker-view .picker-inner .btns {
		height: 80rpx;
		line-height: 80rpx;
		overflow: hidden;
		padding-bottom: 2vw;
	}

	.picker-view .picker-inner .btns .confirm {
		width: 409rpx;
		height: 71rpx;
		color: #fff;
		background-color: #c6a680;
		margin: 0 auto;
		border-radius: 12rpx;
		font-size: 43rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}

	.pick_header {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		border-bottom: 2rpx solid #c6a680;
		height: 95rpx;
		width: 100%;
	}

	.pick-item {
		color: #c6a680;
		height: 100%;
		padding-top: 36rpx;
		box-sizing: border-box;
		font-size: 36rpx;
		font-weight: bolder;
	}

	.pick-active {
		border-bottom: 6rpx solid #c6a680;
	}

	.item {
		line-height: 80rpx;
		text-align: center;
	}

	.btn-box {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
  .re-btn {
  	width: 561rpx;
  	height: 80rpx;
    background: url('@/static/images/liuyao/result/btn.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    font-size: 32rpx;
    font-weight: bold;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
  } 
  .cancel-btn {
    width: 561rpx;
    height: 80rpx;
    
    border: solid 2rpx #32312e;
    margin-top: 11rpx;
    font-size: 32rpx;
    font-weight: bold;
    color: #32312e;
    display: flex;
		justify-content: center;
		align-items: center;
  }

	.input_text {
		font-size: 32rpx;
		white-space: nowrap;
	}
  
  // 重新排盘弹出框
  .confirm-hit-box {
    width: 480rpx;
    height: 480rpx;
    background: url('@/static/images/liuyao/result/box-bg.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    box-sizing: border-box;
    margin: auto;
    position: relative;
  }
  .confirm-tips {
    box-sizing: border-box;
    position: absolute;
    top: 240rpx;
    width: 100%;
    text-align: center;
    font-size: 32rpx;
    color: #000000;
  }
  .confirm-btn-box {
    box-sizing: border-box;
    position: absolute;
    bottom: 80rpx;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    width: 100%;
  }
  .confirm-btn {
    width: 60rpx;
    font-size: 32rpx;
    color: #000000;
  }
</style>
